<template>
  <div class="team-form-success-page">
    <a-result
      status="success"
      title="保存成功！"
      sub-title=""
    >
      <a-descriptions title="班组详情">
        <a-descriptions-item label="名称">{{detail.name}}</a-descriptions-item>
        <a-descriptions-item label="值班电话">{{detail.phone}}</a-descriptions-item>
        <a-descriptions-item label="联系人">{{detail.contactsPerson}}</a-descriptions-item>
        <a-descriptions-item label="备注">{{detail.remark}}</a-descriptions-item>
      </a-descriptions>
      <a-divider style="margin: 16px 0" />
      <div style="text-align: center;">
        <a-button type="dashed" block @click="gotoUpdatePage">
          <FormOutlined />重新修改
        </a-button>
      </div>
      <template #extra>
        <a-button key="console" type="primary" @click="gotoAddUserPage">添加人员</a-button>
        <a-button key="buy" @click="gotoTeamListPage">返回查询列表</a-button>
        <a-button key="buy" @click="gotoAddTeamPage">继续添加</a-button>
      </template>
    </a-result>
  </div>
</template>

<script lang="ts">
import { defineComponent } from 'vue'
import { CommonUtils } from '@/common/common-utils'
import { TeamApi } from '@/views/team/js/team-api'

export default defineComponent({
  name: 'team-form-success',
  data () {
    return {
      detail: { id: null }
    }
  },
  mounted () {
    const id:string = this.$route.query.id as string
    if (id) {
      TeamApi.get(id).then(response => {
        const team = response.data
        Object.assign(this.detail, team)
      })
    }
  },
  methods: {
    gotoAddUserPage () {
      const id:string = this.$route.query.id as string
      let params = ''
      if (!CommonUtils.isNullValue(id)) {
        params = '?teamId=' + id
      }
      this.$router.push('/person/person/form' + params)
    },
    gotoAddTeamPage () {
      this.$router.push('/team/team/form')
    },
    gotoUpdatePage () {
      this.$router.push('/team/team/form/' + this.detail.id)
    },
    gotoTeamListPage () {
      this.$router.push('/team/team')
    }
  }
})
</script>

<style scoped lang="less">

</style>
